<template>
  <div class="home-bg padding-20">
    <div class="search-date flex align-center padding-bottom-20">
      <div class="search-date">
        <span class="font-weight-700">财年</span>
        <el-date-picker v-model="selectTime" type="month" placeholder="选择财年" value-format="timestamp" :clearable="false" clear-icon="el-icon-date" :editable="false" style="width: 100px" @change="refresh"> </el-date-picker>
        <span>{{ fiscalYear }}财年截止{{ fullDate }}</span>
      </div>
      <span class="color-666666 padding-left-30">单位：万元</span>
    </div>

    <div class="flex align-center margin-bottom-10">
      <div class="bg-white one-third-box shadow-box cursor-pointer" @click="openDialog(1)">
        <double-bar title="累计现金流入" :isIncome="true" :showDiff="true" :model="modelIncome"></double-bar>
      </div>
      <div class="vertical-line"></div>
      <div class="bg-white one-third-box shadow-box cursor-pointer" @click="openDialog(3)">
        <double-bar title="累计支出" :isIncome="false" :showDiff="true" :model="modelPay"></double-bar>
      </div>
      <div class="vertical-line"></div>
      <div class="bg-white one-third-box shadow-box cursor-pointer" @click="openDialog(5)">
        <double-bar title="累计净现金流" :isIncome="true" :showDiff="true" :model="modelCash"></double-bar>
      </div>
    </div>
    <div class="flex align-center margin-bottom-20">
      <div class="bg-white one-third-box shadow-box cursor-pointer" @click="openDialog(2)">
        <double-bar title="全年现金流入预测" :isIncome="true" :model="modelIncomeYear" :type="2"></double-bar>
      </div>
      <div class="vertical-line"></div>
      <div class="bg-white one-third-box shadow-box cursor-pointer" @click="openDialog(4)">
        <double-bar title="全年支出预测" :isIncome="false" :model="modelPayYear" :type="2"></double-bar>
      </div>
      <div class="vertical-line"></div>
      <div class="bg-white one-third-box shadow-box cursor-pointer" @click="openDialog(6)">
        <double-bar title="全年净现金流预测" :isIncome="true" :model="modelCashYear" :type="2"></double-bar>
      </div>
    </div>

    <!-- 月净现金流 -->
    <div class="bg-white padding-top-bottom-15 padding-left-15 margin-bottom-20 relative-box">
      <div style="position: inherit; z-index: 2" class="flex align-center margin-bottom-40">
        <span class="font-size-16 font-weight-700">月净现金流</span>
        <span v-tooltip="'月净现金流'" class="question-box margin-left-10">?</span>
        <span class="padding-left-10 color-999999" style="z-index: 999999">单位：万元</span>
      </div>
      <bar class="bar-box" ref="bar" :ch-config="barConfig" :banLegendDefaultClick="true" @chartClick="openDialog(7, $event)"></bar>
      <div v-if="fiscalMonth < 12" class="mask font-weight-700" :style="[{ width: maskWidth + 'px' }]">预测</div>
    </div>

    <!-- 权责 20241031 业务需要注释掉此部分
    <div class="flex align-center padding-bottom-20">
      <div class="bg-white one-third-box shadow-box cursor-pointer" @click="openDialog(8, 'income')">
        <double-bar title="累计权责收入" :isIncome="true" :showDiff="true" :model="modelQaunzeIncome"></double-bar>
      </div>
      <div class="vertical-line"></div>
      <div class="bg-white one-third-box shadow-box cursor-pointer" @click="openDialog(8, 'pay')">
        <double-bar title="累计权责支出" :isIncome="false" :showDiff="true" :model="modelQaunzePay"></double-bar>
      </div>
      <div class="vertical-line"></div>
      <div class="bg-white one-third-box shadow-box cursor-pointer" @click="openDialog(8, 'profit')">
        <double-bar title="累计净利润" :isIncome="true" :showDiff="true" :model="modelQaunzeProfit"></double-bar>
      </div>
    </div>
    -->
    <!-- 项目月报 两个table -->
    <template v-if="systemType != 'assetManagement'">
      <div v-if="pageType == 'planProjectExecute'" class="flex">
        <capture-operate-state ref="capture" class="flex-1 margin-right-20" tableType="capture"></capture-operate-state>
        <capture-operate-state ref="vacancy" class="flex-1" tableType="vacancy"></capture-operate-state>
      </div>
      <!-- 集团运营 集团月报 两个饼图 -->
      <div v-else class="flex">
        <div class="flex-1 shadow-box bg-white margin-right-5 cursor-pointer" @click="openDialog(10)">
          <div class="flex align-center padding-left-10" style="padding-top: 17px">
            <div class="font-size-16 font-weight-700">收缴率</div>
          </div>
          <div class="pie-box flex">
            <div class="pie1-box relative-box" :style="[{ marginLeft: pie1Left + 'px' }]">
              <pie ref="pie1" :banLegendDefaultClick="true" :ch-config="pieConfig1" class="pie1"></pie>
              <div class="absolute-box flex-column align-center justify-center pie1-content">
                <div class="font-size-32 font-weight-500">{{ modelCollect.collectionRate | accMul }}%</div>
                <div class="padding-top-5 padding-bottom-20 flex align-center">
                  <span class="color-666666">收缴率</span>
                  <span v-tooltip="'收缴率'" class="question-box margin-left-5">?</span>
                </div>
                <div>
                  <span class="color-666666">同比</span>
                  <span :class="modelCollect.comparedSameRate > 0 ? 'color-green' : 'color-red'">{{ modelCollect.comparedSameRate > 0 ? '↑' : '↓' }}{{ Math.abs(modelCollect.comparedSameRate) | accMul }}%</span>
                </div>
              </div>
            </div>
            <div class="flex-column align-center justify-center margin-left-45">
              <div class="flex-column align-center justify-center margin-bottom-35">
                <span class="font-size-24 font-weight-500 padding-bottom-10"> {{ modelCollect.arrearageAmount | moneyFilterNoUnit }}<span class="font-size-12">万元</span> </span>
                <div>
                  <span class="color-666666">欠费</span>
                  <span v-tooltip="'欠费'" class="question-box margin-left-5">?</span>
                </div>
              </div>
              <div class="flex-column align-center justify-center">
                <span class="font-size-24 font-weight-500 padding-bottom-10"> {{ modelCollect.arrearageAssetCount }}<span class="font-size-12">个</span></span>
                <div>
                  <span class="color-666666">欠费资产个数</span>
                  <span v-tooltip="'欠费资产个数'" class="question-box margin-left-5">?</span>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="flex-1 shadow-box bg-white margin-left-right-5 cursor-pointer" @click="openDialog(11)">
          <div class="flex justify-between padding-top-10 align-center padding-left-10">
            <div class="font-size-16 font-weight-700 padding-right-30">空置业态占比(面积)</div>
            <!-- <div class="flex">
              <div v-for="(item, index) in tabList" class="tab cursor-pointer margin-right-10" :class="item.type == currentVacancyTab ? 'active' : 'no-active'" :key="index" @click.stop="tabChange(item, 'vacancy')">{{ item.lable }}</div>
            </div> -->
          </div>
          <div class="pie-box">
            <pie ref="pie2" :banLegendDefaultClick="true" :ch-config="pieConfig2" class="pie2"></pie>
          </div>
        </div>
        <div class="flex-1 shadow-box bg-white margin-left-5 cursor-pointer" @click="openDialog(12)">
          <div class="flex justify-between padding-top-10 align-center padding-left-10">
            <div class="font-size-16 font-weight-700 padding-right-30">已租业态占比(面积)</div>
            <!-- <div class="flex">
              <div v-for="(item, index) in tabList" class="tab cursor-pointer margin-right-10" :class="item.type == currentRentTab ? 'active' : 'no-active'" :key="index" @click.stop="tabChange(item, 'rent')">{{ item.lable }}</div>
            </div> -->
          </div>
          <div class="pie-box">
            <pie ref="pie3" :banLegendDefaultClick="true" :ch-config="pieConfig3" class="pie3"></pie>
          </div>
        </div>
      </div>
    </template>

    <dialog-more ref="dialog" :selectTime="selectTime" :universalParams="universalParams" :dialog-type="dialogType" :clickMonth="clickMonth"></dialog-more>
    <dialog-capture ref="dialogcapture" :selectTime="selectTime" :universalParams="universalParams"></dialog-capture>
    <dialog-lease ref="dialoglease" :selectTime="selectTime" :universalParams="universalParams" :dialog-type="dialogType"></dialog-lease>
    <dialog-excute-lease ref="dialogExcuteLease" :dialog-type="dialogType" :selectTime="selectTime" :universalParams="universalParams"></dialog-excute-lease>
    <dialog-rent ref="dialogRent" :dialog-type="dialogType" :selectTime="selectTime" :universalParams="universalParams"></dialog-rent>
  </div>
</template>
<script>
  import dayjs from 'dayjs';
  import doubleBar from '@c/plan/doubleBar';
  import Bar from '@c/echarts/bar';
  import Pie from '@c/echarts/pie';
  import dialogMore from '@c/plan/dialog/dialogMore.vue';
  import dialogLease from '@c/plan/dialog/dialogLease.vue';
  import dialogCapture from '@c/plan/dialog/dialogCapture.vue';
  import dialogExcuteLease from '@c/plan/dialog/dialogExcuteLease.vue';
  import dialogRent from '@c/plan/dialog/dialogRent.vue';
  import captureOperateState from '@c/homeChart/captureOperateState.vue';
  import { barConfig, pieConfig } from '@js/echartsConfig';
  import { apiHomeCashStatistics, apiOperationIncomeCash, performanceFinancial, apiCollectionRate, apiRentalRate, apiJumpConfigList } from '@a/about';
  import { accMul } from '@/common/js/utils';
  import merge from 'webpack-merge';

  export default {
    props: {
      // operate: 集团运营, planGroupExecute: 集团月报, planProjectExecute: 项目月报
      pageType: {
        type: String,
        default: '',
      },
    },

    data() {
      return {
        // selectTime: new Date('2022-12-30').getTime(), //固定时间
        selectTime: new Date().getTime() - 24 * 30 * 60 * 60 * 1000,
        oldTime: '',
        maskWidth: 0,
        barConfig: barConfig,
        pieConfig1: null,
        pieConfig2: null,
        pieConfig3: null,
        pie1Left: 0,
        dialogType: 1,
        clickMonth: 1,
        modelIncome: {},
        modelIncomeYear: {},
        modelPay: {},
        modelPayYear: {},
        modelCash: {},
        modelCashYear: {},
        modelQaunzeIncome: {},
        modelQaunzePay: {},
        modelQaunzeProfit: {},
        modelCollect: {},
        universalParams: {},
        barData: [],
        currentRentTab: 'area', //空置业态占比的tab切换当前值
        currentVacancyTab: 'area', //已租业态占比 的tab切换当前值
        tabList: [
          {
            type: 'area',
            lable: '面积',
          },
          // {
          //   type: 'rent',
          //   lable: '租金',
          // },
        ],
        systemType: localStorage.getItem('systemType'),
        jumpConfigList: [],
      };
    },

    computed: {
      fiscalYear() {
        return dayjs(this.selectTime).format('YYYY');
      },
      fiscalMonth() {
        let date = dayjs(this.selectTime).format('YYYY-MM-DD');
        let month = date.split('-')[1];
        return Number(month);
      },
      fullDate() {
        let date = this.getMonthFinalDay(this.fiscalYear, this.fiscalMonth);
        let month = date.split('-')[1];
        let day = date.split('-')[2];
        return month + '月' + day + '日';
      },
    },

    methods: {
      //上面6个现金流的数据源
      async getHomeCashStatistics() {
        let formData = {};
        // 项目计划/执行 审批状态参数
        if (this.$route.query.processWorkId && this.pageType == 'planProjectExecute') {
          formData.ifSearchDraft = 1;
          formData.source = 'month';
        }

        let res = await apiHomeCashStatistics(Object.assign(formData, this.universalParams));
        this.transformFiled(res);
      },

      //转换字段并赋值字段
      transformFiled(res) {
        //按照下标依次是 当年累计 当年计划 偏差 执行进度 全年
        let sourceFiledList = ['practicalAmount', 'planAmount', 'deviationRate', 'executeProcess', 'yearAmount'];
        // 累计现金流入 | 累计支出 | 累计净现金流
        let totalFiledList = ['currAmount', 'currPlanAmount', 'currDeviationRate', 'currCompleteness', 'yearPlanAmount'];
        this.transformFiledByList(sourceFiledList, totalFiledList, res.incomeCash, 'modelIncome');
        this.transformFiledByList(sourceFiledList, totalFiledList, res.paymentCash, 'modelPay');
        this.transformFiledByList(sourceFiledList, totalFiledList, res.netCash, 'modelCash');

        // 全年现金流入预测 | 全年支出预测 | 全年净现金流预测
        let yearFiledList = ['yearForecastAmount', 'yearPlanAmount', 'yearDeviationRate', 'no', 'yearPlanAmount'];
        this.transformFiledByList(sourceFiledList, yearFiledList, res.incomeCash, 'modelIncomeYear');
        this.transformFiledByList(sourceFiledList, yearFiledList, res.paymentCash, 'modelPayYear');
        this.transformFiledByList(sourceFiledList, yearFiledList, res.netCash, 'modelCashYear');
      },
      transformFiledByList(sourceList, targetList, targetData, resultObjName) {
        sourceList.forEach((item, index) => {
          this.$set(this[resultObjName], item, targetData[targetList[index]]);
        });
      },

      //月净现金流数据源
      async getMonthCash() {
        this.initMask();

        let formData = {
          planYear: this.universalParams.year,
          planMonth: this.universalParams.month,
          projectKeys: this.$route.query.projectKey && this.$route.query.projectKey != 'null' ? [this.$route.query.projectKey] : this.universalParams.projectKeys,
        };
        // 项目计划/执行 审批状态参数
        if (this.$route.query.processWorkId && this.pageType == 'planProjectExecute') {
          formData.ifSearchDraft = 1;
          formData.source = 'month';
        }

        let res = await apiOperationIncomeCash(formData);
        this.barData = res.itemList || [];
        //初始化x轴坐标
        res.itemList.forEach(item => {
          this.barConfig.xAxisData.push(item.month + '月');
          this.barConfig.list[0].data.push(item.netCashAmount);
        });
        this.$refs.bar.initChart();
      },

      //财务表现数据源
      async getInfoFinal() {
        let res = await performanceFinancial(this.universalParams);
        //按照下标依次是 当年累计 当年计划 偏差 执行进度 全年
        let sourceFiledList = ['practicalAmount', 'planAmount', 'deviationRate', 'executeProcess', 'yearAmount'];
        let targetList = ['currAmount', 'currPlanAmount', 'currDeviationRate', 'currCompleteness', 'yearPlanAmount'];
        sourceFiledList.forEach((item, index) => {
          res.incomeForecast[item] = res.incomeForecast[targetList[index]];
          res.netForecast[item] = res.netForecast[targetList[index]];
          res.paymentForecast[item] = res.paymentForecast[targetList[index]];
        });

        this.modelQaunzeIncome = res.incomeForecast;
        this.modelQaunzePay = res.paymentForecast;
        this.modelQaunzeProfit = res.netForecast;
      },

      //收缴率数据源
      async getCollectionRate() {
        let res = await apiCollectionRate(this.universalParams);
        this.modelCollect = res;
        let list = [
          { name: '已收', value: 0, color: '#29C37F' },
          { name: '未收', value: 0, color: '#EFEFEF' },
        ];
        list[0].value = res.collectionRate * 100;
        list[1].value = 100 - res.collectionRate * 100;
        list.forEach(item => {
          this.pieConfig1.list.push(item);
          this.pieConfig1.color.push(item.color);
        });
        this.$refs.pie1.initChart();
      },

      //出租率饼图 在租
      async getRentalRentRate() {
        this.pieConfig3.list.splice(0, this.pieConfig3.list.length);
        this.pieConfig3.color.splice(0, this.pieConfig3.color.length);
        let params = this.lodash.cloneDeep(this.universalParams);
        params.assetState = 1;
        params.rateType = this.currentRentTab == 'area' ? 1 : 2;
        let res = await apiRentalRate(params);
        let list = [
          { name: '商铺-散铺', value: 0, color: '#447B99' },
          { name: '商铺-主力店', value: 0, color: '#70BAB0' },
          { name: '写字楼', value: 0, color: '#B4E1C2' },
          { name: '库房 ', value: 0, color: '#CEE0D3' },
        ];
        list[0].value = accMul(res.commercialScatteredRentRate, 100);
        list[1].value = accMul(res.commercialMainStoreRentRate, 100);
        list[2].value = accMul(res.officeRentRate, 100);
        list[3].value = accMul(res.warehouseRentRate, 100);
        list.forEach(item => {
          if (item.value > 0) {
            this.pieConfig3.color.push(item.color);
            this.pieConfig3.list.push(item);
          }
        });
        this.$refs.pie3.initChart();
      },

      //出租率饼图 空置
      async getRentalVacancyRate() {
        this.pieConfig2.list.splice(0, this.pieConfig2.list.length);
        this.pieConfig2.color.splice(0, this.pieConfig2.color.length);
        let params = this.lodash.cloneDeep(this.universalParams);
        params.assetState = 2;
        params.rateType = this.currentVacancyTab == 'area' ? 1 : 2;
        let res = await apiRentalRate(params);
        let list = [
          { name: '商铺', value: 0, color: '#447B99' },
          { name: '写字楼', value: 0, color: '#B4E1C2' },
          { name: '库房 ', value: 0, color: '#CEE0D3' },
        ];
        list[0].value = accMul(res.storeRentRate, 100);
        list[1].value = accMul(res.officeRentRate, 100);
        list[2].value = accMul(res.warehouseRentRate, 100);
        list.forEach(item => {
          if (item.value > 0) {
            this.pieConfig2.color.push(item.color);
            this.pieConfig2.list.push(item);
          }
        });
        this.$refs.pie2.initChart();
      },

      //tab切换
      async tabChange(item, type) {
        if (type == 'vacancy') {
          this.currentVacancyTab = item.type;
          this.getRentalVacancyRate();
        } else if (type == 'rent') {
          this.currentRentTab = item.type;
          this.getRentalRentRate();
        }
      },

      //初始化charts数据
      initChartData() {
        this.barConfig.xAxisData.splice(0, this.barConfig.xAxisData.length);
        this.barConfig.list[0].data.splice(0, this.barConfig.list[0].data.length);

        this.pieConfig1.list.splice(0, this.pieConfig1.list.length);
        this.pieConfig2.list.splice(0, this.pieConfig2.list.length);
        this.pieConfig3.list.splice(0, this.pieConfig3.list.length);
      },

      //初始化charts配置
      initChartConfig() {
        this.initBar();
        this.initPie();
      },

      //初始化柱状图
      initBar() {
        this.barConfig.dataZoom = false;
        this.barConfig.list[0].barWidth = '40%';
        this.barConfig.left = '5px';
        this.barConfig.gridTop = '20px';
        this.barConfig.gridBottom = '20px';
        this.barConfig.list[0].label.textStyle.color = '#666666';
        this.barConfig.list[0].label.formatter = '{c}';
        this.barConfig.yAxis.grainUnit = '';
        this.barConfig.yAxis.gridShow = false;
        this.barConfig.yAxis.splitLineShow = false;
        this.barConfig.tooltip.show = false;
        this.barConfig.list[0].itemStyle.normal.color = function (params) {
          let color = params.value > 0 ? '#4E9475' : '#FF7A81';
          return color;
        };
      },

      //配置bar的tooltip
      initTooltip(params) {
        let tips = '';
        let data = this.barData[params[0].dataIndex];
        if (params[0].dataIndex + 1 > this.fiscalMonth) {
          tips = `${params[0].name}净现金流预测：<br/>
                  ${params[0].name}现金流入预测${data.calculateIncomeCash}<br/>
                  -${params[0].name}支出预测${data.calculatePaymentCash}<br/>
                  =${params[0].name}净现金流预测${data.netCashAmount}`;
        } else {
          tips = `${params[0].name}净现金流：<br/>
                  ${params[0].name}现金流入${data.incomeCash}<br/>
                  -${params[0].name}支出${data.paymentCash}<br/>
                  =${params[0].name}净现金流${data.netCashAmount}`;
        }
        return tips;
      },

      //初始化饼状图
      initPie() {
        let pieConfig1 = this.lodash.cloneDeep(pieConfig);
        pieConfig1.legend.show = false;
        pieConfig1.legend.center = ['50%', '50%']; //图形的中心点，['50%', '50%']就是盒子的最中心为原点
        pieConfig1.legend.radius = ['85%', '100%']; //第一个参数是从里往外扩，第二个参数是从外往里扩
        this.pieConfig1 = pieConfig1;

        let pieConfig2 = this.lodash.cloneDeep(pieConfig);
        pieConfig2.legend.left = '60%';
        pieConfig2.legend.center = ['30%', '50%'];
        pieConfig2.legend.radius = '65%';
        this.pieConfig2 = pieConfig2;

        let pieConfig3 = this.lodash.cloneDeep(pieConfig);
        pieConfig3.legend.left = '60%';
        pieConfig3.legend.center = ['30%', '50%'];
        pieConfig3.legend.radius = '65%';
        this.pieConfig3 = pieConfig3;
      },

      //第一个饼图的left值
      getPie1MarginLeft() {
        let pieBoxWidth = document.getElementsByClassName('pie-box')[0].clientWidth; //宽度的基数
        this.pie1Left = pieBoxWidth * 0.3 - (300 * 0.7) / 2; //第一个饼图的left值 = 盒子的宽度 * 30% - 盒子的高度 * 70% / 2
      },

      //查看弹框
      async openDialog(index, data) {
        this.dialogType = index;
        await this.$nextTick();
        if (this.pageType == 'planGroupExecute' || this.pageType == 'planProjectExecute') {
          if (index == 1 || index == 2 || index == 5 || index == 6 || index == 7) {
            this.goInfo('income');
          } else if (index == 3 || index == 4) {
            this.goInfo('pay');
          } else if (index == 8) {
            this.goInfo('profit');
          }
        } else {
          // 7:柱状图点击 查看当前点击月的数据
          if (index == 7) {
            this.clickMonth = data.dataIndex + 1;
          }
          if ([1, 2, 3, 4, 5, 6, 7, 8].includes(index)) {
            setTimeout(() => {
              let dutyType = index == 8 ? data : '';
              this.$refs.dialog.init(dutyType);
            }, 0);
          }
        }
        if (index == 10) {
          setTimeout(() => {
            this.$refs.dialogcapture.init();
          }, 0);
          return;
        }
        // console.log(index);
        if (index == 11) {
          this.currentVacancyTab == 'area' ? this.$refs.dialoglease.init() : this.$refs.dialogRent.init();
        } else if (index == 12) {
          this.currentRentTab == 'area' ? this.$refs.dialoglease.init() : this.$refs.dialogRent.init();
        }
      },

      //获取月最后一天的日期
      getMonthFinalDay(year, month) {
        var day = '';
        if (year == null || year == undefined || year == '') {
          year = new Date().getFullYear();
        }
        if (month == null || month == undefined || month == '') {
          month = new Date().getMonth() + 1;
        }
        day = new Date(new Date(year, month).setDate(0)).getDate();
        return year + '-' + month + '-' + day;
      },

      //通用参数初始化
      initUniversalParams() {
        let projectKey = localStorage.getItem('projectKey');
        this.universalParams = {
          year: this.fiscalYear || null,
          month: this.fiscalMonth || null,
        };
        if (this.$route.query.projectKey) {
          this.universalParams.projectKeys = [this.$route.query.projectKey];
          return;
        }
        if (this.systemType == 'operationManagement' && projectKey) {
          this.universalParams.projectKeys = [projectKey];
        }
      },

      //mask的宽度和位置
      async initMask() {
        await this.$nextTick();
        setTimeout(() => {
          let baseWidth = document.body.clientWidth - 60;
          let diffMonth = 12 - this.fiscalMonth;

          this.maskWidth = diffMonth == 0 ? 0 : (diffMonth / 12) * baseWidth + 2 * this.fiscalMonth - 2;
        }, 300);
      },

      refresh() {
        let lock = this.validateDate();
        if (!lock) return;
        this.initUniversalParams();
        this.initChartData();
        this.init();
        this.$router.replace({
          query: merge(this.$route.query, { year: this.universalParams.year, month: this.universalParams.month }),
        });
      },

      async getJumpConfigList() {
        let res = await apiJumpConfigList({ type: 'system' });
        this.jumpConfigList = res.rows || [];
      },

      //选择时间进行校验
      validateDate() {
        let year = new Date(this.selectTime).getFullYear();
        let oldYear = new Date(this.oldTime).getFullYear();
        let oldMonth = new Date(this.oldTime).getMonth() + 1;

        for (let i = 0; i < this.jumpConfigList.length; i++) {
          let item = this.jumpConfigList[i];
          if (year == item.year) {
            this.$message.warning(item.description);
            this.selectTime = new Date('2022-12').getTime();
            return false;
          }
        }

        if (year < 2020) {
          this.$message.warning(year + '财年月度明细数据待补充，暂时仅提供全年执行数据。');
          this.selectTime = new Date('2019-12').getTime();
          if (oldYear == 2019 && oldMonth == 12) {
            return false;
          }
        }
        this.oldTime = this.selectTime;
        return true;
      },

      init() {
        this.getMonthCash();
        this.getInfoFinal();
        this.getHomeCashStatistics();
        if (this.pageType != 'planProjectExecute' && this.systemType != 'assetManagement') {
          this.getCollectionRate();
          this.getRentalRentRate();
          this.getRentalVacancyRate();
        }
      },

      //去详情页
      goInfo(type) {
        let pathName = '';
        if (type == 'income') {
          pathName = this.pageType == 'planGroupExecute' ? '/businessPlan/businessManage/groupmonthIncome' : '/businessPlan/businessManage/executeIncome';
        } else if (type == 'pay') {
          pathName = this.pageType == 'planGroupExecute' ? '/businessPlan/businessManage/groupmonthPay' : '/businessPlan/businessManage/executePay';
        } else if (type == 'profit') {
          pathName = this.pageType == 'planGroupExecute' ? '/businessPlan/businessManage/groupmonthProfit' : '/businessPlan/businessManage/executeProfit';
        }
        window.location.href = pathName + location.search;
      },
    },

    created() {
      if (this.pageType == 'planGroupExecute' || this.pageType == 'planProjectExecute') {
        this.selectTime = new Date(this.$route.query.year, this.$route.query.month - 1).getTime();
      }
      this.initChartConfig();
      this.initUniversalParams();
      this.getJumpConfigList();
    },

    mounted() {
      this.init();
      if (this.pageType != 'planProjectExecute' && this.systemType != 'assetManagement') this.getPie1MarginLeft();
    },

    components: { doubleBar, Bar, Pie, dialogMore, dialogLease, dialogCapture, dialogExcuteLease, dialogRent, captureOperateState },
  };
</script>

<style lang="scss" scoped>
  ::v-deep .cursor-pointer {
    canvas {
      cursor: pointer !important;
    }
  }

  .search-date {
    ::v-deep .el-input--suffix .el-input__inner {
      padding-right: 0;
      border: none;
      background: #f8f8f8;
    }
    ::v-deep .el-icon-date {
      color: #333;
    }
  }
  .bar-box {
    width: 100%;
    height: 340px;
  }
  .pie-box {
    width: 100%;
    height: 308px;
  }
  .pie1-box {
    margin-top: 45px;
    width: 210px;
    height: 210px;
    .pie1-content {
      width: 210px;
      height: 210px;
      left: 0;
      top: 0;
    }
  }
  .mask {
    height: 390px;
    background: rgba($color: #dbfeff, $alpha: 1);
    position: absolute;
    top: 43px;
    right: 0;
    padding-left: 20px;
    padding-left: 5px;
    padding-top: 5px;
  }

  .tab {
    width: 70px;
    height: 30px;
    line-height: 30px;
    text-align: center;
  }

  .active {
    background: rgba($color: #3384fe, $alpha: 0.1);
    border-radius: 3px;
    color: #3384fe;
  }
  .no-active {
    background: rgba($color: #d1cbcb, $alpha: 0.1);
    border-radius: 3px;
    color: #333;
  }
  .shadow-box:hover {
    box-shadow: 0px 6px 15px 0px rgba(0, 0, 0, 0.1);
  }
  .search-date {
    ::v-deep .el-input--suffix .el-input__inner {
      cursor: pointer;
    }
    ::v-deep .el-input--suffix .el-input__inner:hover {
      color: #3384fe;
    }
  }
</style>
